<template>
	<view class="">
		<view class="nav_top-bg">
			<u-navbar title="关于我们">
				<view class="u-nav-slot" slot="left">
					<u-icon name="arrow-left" @click="go_black" size="19"></u-icon>
					<u-line direction="column" :hairline="false" length="16" margin="0 10px"></u-line>
					<u-icon name="home" @click="goHome" size="20"></u-icon>
				</view>
			</u-navbar>
		</view>
		<!-- tabs筛选 -->
		<view class="tabslist">
			<view class="anliList">
				<u-tabs :list="anli_list" keyName="title" :current="current" lineWidth="48rpx" lineColor="#FF6400"
					:activeStyle="{
			    color: '#FF6400',
			    fontWeight: 'bold',
			    transform: 'scale(1.05)'
			}" @click="anli_click"></u-tabs>
			</view>
		</view>
		<!-- 公司介绍 -->
		<view class="w-650">
			<view class="company_title">{{neirong.title}}</view>
			<view class="tiaojian">
				<u-parse :content="neirong.content"></u-parse>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		index_us,
		detail
	} from '@/api/user.js'
	export default {
		data() {
			return {
				current: 0,
				anli_list: [],
				neirong:{},
			}
		},
		async onLoad(option) {
			this.current = option.current
			await this.get_us()
			this.detail_us()
		},
		methods: {
			go_black() {
				uni.navigateBack({
					delta: 1
				})
			},
			goHome() {
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			anli_click(item) {
				console.log('item', item);
				this.current = item.index
				this.detail_us()
			},
			// 获取协议接口
			async get_us() {
				var data = {
					model: 1,
					channel: 24,
				}
				await index_us(data).then(res => {
					console.log("获取关于我们", res);
					if (res.code == 1) {
						this.anli_list = res.data.archivesList
					}
				})
			},
			detail_us(){
				var data = {
					id:this.anli_list[this.current].id
				}
				detail(data).then(res => {
					console.log("获取结果",res);
					if(res.code == 1){
						this.neirong = res.data.archivesInfo
					}
				})
			},
		}
	}
</script>

<style>
	.tiaojian {
		font-size: 28rpx;
		font-weight: normal;
		line-height: 48rpx;
		color: #5F5F5F;
	}

	.company_title {
		font-size: 28rpx;
		font-weight: 600;
		color: #1F1F39;
		margin: 39rpx 0 23rpx 0;
	}

	.anliList {
		width: 700rpx;
		margin: auto;
	}

	.tabslist {
		width: 750rpx;
		background-color: #fff;
		height: 84rpx;
		margin-top: 1px;
	}

	page {
		background-color: #F7F8FB;
	}
</style>